{% extends 'base.html' %}

{% load crispy_forms_tags %}

{% block content %}
  <nav aria-label="breadcrumb">
    <ol class="breadcrumb">
      <li class="breadcrumb-item"><a href="{% url 'teachers:quiz_change_list' %}">My Quizzes</a></li>
      <li class="breadcrumb-item active" aria-current="page">{{ quiz.name }}</li>
    </ol>
  </nav>
  <h2 class="mb-3">
    {{ quiz.name }}
    <a href="{% url 'teachers:quiz_results' quiz.pk %}" class="btn btn-primary float-right">View results</a>
  </h2>
  <div class="row mb-3">
    <div class="col-md-6 col-sm-8 col-12">
      <form method="post" novalidate>
        {% csrf_token %}
        {{ form|crispy }}
        <button type="submit" class="btn btn-success">Save changes</button>
        <a href="{% url 'teachers:quiz_change_list' %}" class="btn btn-outline-secondary" role="button">Nevermind</a>
        <a href="{% url 'teachers:quiz_delete' quiz.pk %}" class="btn btn-danger float-right">Delete</a>
      </form>
    </div>
  </div>
  <div class="card">
    <div class="card-header">
      <div class="row">
        <div class="col-10">
          <strong>Questions <a href="{% url 'teachers:question_add' quiz.pk %}" class="btn btn-primary btn-sm">+</a></strong>
        </div>
        <div class="col-2">
          <strong>Answers</strong>
        </div>
      </div>
    </div>
    <div class="list-group list-group-flush list-group-formset">
      {% for question in questions %}
        <div class="list-group-item">
          <div class="row">
            <div class="col-10">
              <a href="{% url 'teachers:question_change' quiz.pk question.pk %}">{{ question.text }}</a>
              <a class="btn btn-sm btn-secondary" href="{% url 'teachers:question_preview' quiz.pk question.pk %}">preview</a>
            </div>
            <div class="col-2">
              {{ question.answers_count }}
            </div>
          </div>
        </div>
      {% empty %}
        <div class="list-group-item text-center">
          <p class="text-muted font-italic mb-0">You haven't created any questions yet. Go ahead and <a href="{% url 'teachers:question_add' quiz.pk %}">add the first question</a>.</p>
        </div>
      {% endfor %}
    </div>
    <div class="card-footer">
      <a href="{% url 'teachers:question_add' quiz.pk %}" class="btn btn-primary btn-sm">Add question</a>
    </div>
  </div>
{% endblock %}
